<style lang="less" scoped>
  .ads_items {}
  .ads_item {
    position: relative; width:100%; padding: 0.3rem 0.3rem; background-color: #fff; overflow: hidden;
    .check {
      float: left; width: 0.44rem; height: 1rem;
      i { position: absolute; width: 0.4rem; height: 0.4rem; top: 0; bottom: 0; margin: auto 0; background: url("/static/images/icon_yq_f.png") no-repeat center; background-size: 0.33rem;}
      i.active {background: url("/static/images/icon_yq_t.png") no-repeat center; background-size: 0.33rem;}
    }
    .con {
      float: left; margin-left: 0.24rem; font-size: 0.28rem;
      div {color: #333;}
      div span {display: inline-block; width: 5em;}
      p {color: #999; width: 5.5rem; min-height: 0.3rem; margin-top: 0.15rem;}
    }
    .edit {position: absolute; top: 50%; right: 0.4rem; transform: translateY(-50%); }
  }
  .ads_bottom {position: fixed; bottom: 0; height: 0.9rem; width: 100%; line-height: 0.9rem; text-align: center; font-size: 0.3rem; color: #fff; background-color: #d3ac6f;}
</style>
<template>
  <div class="ads_wrap">
    <NoMore v-if="false">当前购物车还没有商品</NoMore>
    <ul v-else class="ads_items">
      <LeftSlider style="margin-bottom: 0.1rem;" v-for="(item,index) in collectionList":key="index" :index="index" @delItem="delItem">
          <li class="ads_item" @click.stop="fn">
            <div class="check"><i :class="'active'"></i></div>
            <div class="con">
                <div><span>郑华源</span><em>18959271550</em></div>
                <p><yd-icon name="location" size="0.3rem" style="margin-right: 0.3em;"></yd-icon>福建省厦门市防护系列水电费都防护系列护系列水水</p>
            </div>
            <router-link to="/EditAddress">
              <yd-icon @click.native.stop="fn1" class="edit" name="compose" color="#666" size="0.52rem"></yd-icon>
            </router-link>
          </li>
        </LeftSlider>
    </ul>
    <router-link to="/EditAddress"><div class="ads_bottom">新增地址</div></router-link>
  </div>
</template>

<script>
import LeftSlider from '../Common/LeftSlider.vue';
import NoMore from '../Common/NoMore.vue';

export default {
  components: { LeftSlider, NoMore },
  data() {
    return {
      collectionList: [1,2,3]
    }
  },
  methods: {
    delItem() {
      console.log("del")
    },
    fn() {
      console.log("sel")
    },
    fn1() {
      console.log("edit")
    }
  }
}
</script>
